<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>考勤统计</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="__PUBLIC__/assets/css/admin.css" media="all">
</head>
<body>
<div class="panel panel-default panel-intro">
    <div class="panel-heading">
        <ul class="nav nav-tabs">
            <li class="active"><a href="#one" data-toggle="tab">考勤统计</a></li>
        </ul>
        <div class="panel-lead"><em>考勤统计</em>模块用于管理学员的考勤记录</div>
    </div>
    <div class="panel-body">
        <div id="myTabContent" class="tab-content">
            <div class="tab-pane fade active in" id="one">
                <div class="widget-body no-padding">
                    <div id="toolbar" class="toolbar">
                        <a href="javascript:;" class="btn btn-primary btn-refresh" title="刷新"><i class="fa fa-refresh"></i> </a>
                    </div>
                    <table id="table" class="table table-striped table-bordered table-hover" width="100%">
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="__PUBLIC__/assets/js/require.min.js"></script>
<script>
    require.config({
        baseUrl: '__PUBLIC__/assets',
        paths: {
            'bootstrap': 'libs/bootstrap',
            'jquery': 'libs/jquery',
            'lang': 'langs/{$config.language??''}',
        },
        shim: {
            'bootstrap': {
                deps: ['jquery']
            }
        },
        deps: [
            'lang'
        ]
    });
    require(['jquery', 'bootstrap'], function ($, undefined) {
        require(['backend'], function (Backend) {
            Backend.api.fixurl('{$request->url()}');
            Backend.api.init();
            require(['table'], function (Table) {
                // 初始化表格参数配置
                Table.api.init({
                    extend: {
                        index_url: 'attendance_statistics/index',
                        add_url: '',
                        edit_url: '',
                        del_url: '',
                        multi_url: '',
                        table: 'attendance_statistics',
                    }
                });

                var table = $("#table");

                // 初始化表格
                table.bootstrapTable({
                    url: $.fn.bootstrapTable.defaults.extend.index_url,
                    pk: 'id',
                    sortName: 'id',
                    columns: [
                        [
                            {field: 'state', checkbox: true},
                            {field: 'id', title: 'ID', operate: false},
                            {field: 'classes_id', title: '班级ID', operate: false},
                            {field: 'user_id', title: '用户ID', operate: false},
                            {field: 'clock_in_time', title: '打卡时间', operate: 'RANGE', addclass: 'datetimerange', formatter: Table.api.formatter.datetime},
                            {field: 'status', title: '状态', operate: false, formatter: Table.api.formatter.status},
                            {field: 'create_time', title: '创建时间', operate: 'RANGE', addclass: 'datetimerange', formatter: Table.api.formatter.datetime},
                            {field: 'update_time', title: '更新时间', operate: 'RANGE', addclass: 'datetimerange', formatter: Table.api.formatter.datetime},
                            {field: 'operate', title: '操作', table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
                        ]
                    ]
                });

                // 为表格绑定事件
                Table.api.bindevent(table);
            });
        });
    });
</script>
</body>
</html>